﻿@using DongHuMgmt.Common.Models;
@model LoginUserModel

@{
    Layout = null;
    ViewBag.Title = "登录";
}

<!doctype html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="keywords" content="DonghuAdmin">
    <meta name="description" content="DonghuAdmin">
    <link rel="stylesheet" href="~/Static/lib/bootstrap-icons/font/bootstrap-icons.min.css">
    <link rel="stylesheet" href="~/Static/lib/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="~/Static/dist/css/bootstrap-admin.min.css">
    <title>DonghuAdmin</title>
</head>
<body>
    <div class="min-vh-100  p-2 bg-body-tertiary d-flex flex-column align-items-center justify-content-center">
        <h2>donghu-admin</h2>
        <p class="text-secondary">DongHu管理系统</p>
        @using (Html.BeginForm("Login", "Login", FormMethod.Post, new { @id = "form", @class = "form", @style = "width: 380px;max-width: 100%" }))
        {
            @Html.AntiForgeryToken()
            <div class="mb-3">
                <div class="input-group">
                    <span class="input-group-text bg-white "><i class="bi bi-person"></i></span>
                    @Html.TextBoxFor(m => m.LoginName, new { @class = "form-control", @type = "text", @autocomplete = "off", @placeholder = "请输入用户", @aria_label = "username" })
                    @Html.ValidationMessage("LoginName", new { @style = "color: red" })
                </div>
            </div>

            <div class="mb-3">
                <div class="input-group bsa-show_hide_password">
                    <span class="input-group-text bg-white"><i class="bi bi-person-lock"></i></span>
                    @Html.TextBoxFor(m => m.Password, new { @type = "password", @class = "form-control", @autocomplete = "off", @aria_label = "password", @placeholder = "请输入密码" })
                    <span class="input-group-text bg-white bsa-cursor-pointer"><i class="bi bi-eye-slash"></i></span>
                    @Html.ValidationMessage("Password", new { @style = "color: red" })
                </div>
            </div>

            <div class="mb-3">
                <div class="input-group">
                    <span class="input-group-text bg-white"><i class="bi bi-shield-lock"></i></span>
                    @Html.TextBoxFor(m => m.Captcha, new { @class = "form-control", @type = "text", @autocomplete = "off", @placeholder = "请输入验证码", @aria_label = "captcha", @style = "min-width: 80px" })
                    <img src="~/Static/dist/img/captcha.gif" alt="验证码" class="bsa-cursor-pointer" style="height: 38px;width: 120px" />
                    @Html.ValidationMessage("Captcha", new { @style = "color: red" })
                </div>
            </div>

            <div class="mb-3 d-flex align-items-center justify-content-between flex-wrap gap-3 ">
                <div class="form-check">
                    @Html.CheckBoxFor(c => c.Remember, new { @class = "form-check-input", @Id = "remember" })
                    <label class="form-check-label" for="remember">十天内免登录</label>
                </div>
                <a href="javascript:" class="link-success text-decoration-none">忘记密码?</a>
            </div>

            <div class="d-grid gap-2">
                <button class="btn btn-outline-success" type="submit"><i class="bi bi-box-arrow-in-right"></i> 登入</button>
            </div>
        }

    </div>


    <script src="~/Static/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
    <script src="~/Static/lib/jquery/dist/jquery.min.js"></script>
    <script src="~/Static/lib/formvalidation/js/formValidation.js"></script>
    <script src="~/Static/lib/formvalidation/js/framework/bootstrap.js"></script>
    <script src="~/Static/lib/formvalidation/js/language/zh_CN.js"></script>
    <script src="~/Static/dist/js/bootstrap-admin.min.js"></script>
    <script src="~/Static/dist/js/app.js"></script>

    <script>
        $(function () {
            ////前端表单验证
            //$('#form').formValidation({
            //    fields: {
            //        username: {
            //            validators: {
            //                notEmpty: true,
            //            }
            //        },
            //        password: {
            //            validators: {
            //                notEmpty: true,
            //            }
            //        },
            //        captcha: {
            //            validators: {
            //                notEmpty: true,
            //            }
            //        }
            //    }
            //}).on('success.form.fv', function (e) {
            //    //阻止表单提交
            //    e.preventDefault();

            //    //得到表单对象
            //    let $form = $(e.target);
            //    //获取数据
            //    let data = $form.serialize();


            //    //发起ajax请求
            //    $.ajax({
            //        method: 'post',
            //        url: '/login',
            //        //表单数据
            //        data: data,
            //    }).then(response => {
            //        if (response.code === 200) {

            //            $.toasts({
            //                type: 'success',
            //                content: '登录成功',
            //                onHidden: function () {
            //                    top.location.replace('/index.html');
            //                }
            //            })
            //        }
            //    });
            //});
        })
    </script>

</body>
</html>

